<!DOCTYPE html>
<html lang="zh">
<head>
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta charset="utf-8"/>
    <title>title</title>

</head>
<body>
    <div id="app">
        <input type="text" v-model="value">
        <p>value in #app: {{value}}</p>
        <parent :value="value"></parent>
    </div>

    <script type="text/javascript" src="../vue-2.5.17/dist/vue.js"></script>
    <script>
        Vue.component('parent', {
            inheritAttrs: false,
            template: `
                <child v-bind="$props" v-bind="$attrs"></child>
            `
        });
        Vue.component('child', {
            props: ['value'],
            template: `
                <p>value in child: {{value}}</p>
            `
        });
        new Vue({
            el: '#app',
            data: {
                value: 'abc'
            }
        });
    </script>
</body>
</html>